<template>
    <div>
        <a href="/Add">新增</a>
        姓名:<input type="text" v-model="quer.name">
        <input type="text" v-model="quer.id">
        <input type="button" value="查询" @click="show">
        <table>
            <thead>
                <tr>
                    <td>id</td>
                    <td>姓名</td>
                    <td>年龄</td>
                    <td>性别</td>
                    <td>出生</td>
                    <td>爱好</td>
                    <td>身份证</td>
                    <td>手机号码</td>
                </tr>
            </thead>
            <tbody>
                <tr v-for="a in data">
                    <td>{{ a.id }}</td>
                    <td>{{ a.name }}</td>
                    <td>{{ a.age }}</td>
                    <td>{{ a.sex==1?"男":"女" }}</td>
                    <td>{{ moment(a.dates).format("YYYY-MM-DD") }}</td>
                    <td>{{ a.hobby }}</td>
                    <td>{{ a.icard }}</td>
                    <td>{{ a.phone }}</td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref,onMounted } from 'vue';
import axios from 'axios';
import moment from 'moment';

onMounted(()=>{
    show();
})

const quer=ref({
    name:"",
    id:0
})

const show=()=>{
    axios.get("https://localhost:7251/api/Member/GetMembers",{params:quer.value}).then(res=>{
        data.value=res.data;
    })
}

const data=ref([{
  "id": 0,
  "name": "",
  "age": 0,
  "sex": 0,
  "dates": "",
  "hobby": "",
  "icard": "",
  "phone": ""
}])
</script>

<style scoped>

</style>